<script setup lang="ts">
import websocketUtils from "@/utils/websocketUtils.js";
import { getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
import useCounterStore from "@/stores/counter";
const counter = useCounterStore();

import YeIMStore from "@/stores/YeIM";
const YeIM = YeIMStore();

onLaunch(() => {
  init();
  // setTimeout(() => {
  // 	uni.setTabBarBadge({
  // 		index: 1,
  // 		text: '31'
  // 	});
  // 	uni.showTabBarRedDot({
  // 		index: 3
  // 	});
  // }, 1000);
});
onShow(() => {
  counter.updateUserToken(1);
  counter.init();
  //nim.initIm();
});
onHide(() => {
  counter.updateUserToken(2);
});
onUnload(() => {
  counter.updateUserToken(2);
});

function init() {
  YeIM.init(); //初始化聊天室

  //初始化websocket
  if (!counter.slParams.userInfo.userId) return;
  new websocketUtils(
    `ws://47.95.197.43:18033/playBack/${counter.slParams.userInfo.userId}`,
    10
  );
  //监听获取消息
  uni.$on("socketMessage", (res) => {
    console.log("18033-ws接收到的消息2", res);
  });
  uni.$on("socketOpen", (res) => {
    if (res.code == 200) counter.slParams.wsStatus = 1;
  });
  uni.$on("socketClose", (res) => {
    if (res.code == 400) counter.slParams.wsStatus = 0;
  });
}

watch(
  () => counter.userType,
  (newValue, oldValue) => {
    if (newValue == 2) {
      uni.setTabBarItem({
        index: 1,
        visible: false,
        success: () => {
          //console.log("成功?");
        },
        fail: (e) => {
          //console.log("失败", e);
        },
      });
    }
  },
  { deep: true, immediate: true }
);

watch(
  () => counter.isLogin,
  (newValue, oldValue) => {
    if (newValue && counter.slParams.wsStatus == 0) init();
  },
  { deep: true, immediate: true }
);
</script>

<style>
.viewAuto {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.flexWrap {
  flex-wrap: wrap;
}
/*每个页面公共css */
image {
  width: 100% !important;
  display: block;
}
.positionRelative {
  position: relative;
}
.flex {
  display: flex !important;
}
.alignStart {
  align-items: flex-start;
}
.alignCenter {
  align-items: center;
}
.aspectRatio {
  width: 100%;
  padding-top: 100%;
  position: relative;
}
.justifyBetween {
  justify-content: space-between;
}
.justifyCenter {
  justify-content: center;
}
.justifyAround {
  justify-content: space-around;
}
.bold {
  font-weight: bold;
}
.textCenter {
  text-align: center;
}
.textRight {
  text-align: right;
}
.alignBaseline {
  align-items: baseline;
}
.alignEnd {
  align-items: end;
}
.justifyFlexEnd {
  justify-content: flex-end;
}
.fz12 {
  font-size: 12px;
}
.fz14 {
  font-size: 14px;
}
.fz16 {
  font-size: 16px;
}
.fz18 {
  font-size: 18px;
}
.fz10 {
  font-size: 10px;
}
.fz20 {
  font-size: 20px;
}
.fz24 {
  font-size: 24px;
}
.justifyStart {
  justify-content: flex-start;
}
.justifyEnd {
  justify-content: flex-end;
}
.grids {
  width: 100%;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
}
.gridColumns6 {
  grid-template-columns: repeat(6, minmax(0px, 1fr));
}
.gridColumns5 {
  grid-template-columns: repeat(5, minmax(0px, 1fr));
}
.gridColumns3 {
  grid-template-columns: repeat(3, minmax(0px, 1fr));
}
.gridColumns2 {
  grid-template-columns: repeat(2, minmax(0px, 1fr));
}
.shrink {
  flex-shrink: 0;
}
.width100 {
  width: 100% !important;
}
.displayInherit {
  display: inherit;
}
.marginLeft10 {
  margin-left: 10px;
}
.picker-view .active {
  background-color: #f6f6f6;
}
</style>
